<template>
	<view>
		<div class="banner p15">
			<uni-row class="p8">
				<uni-col :span="10">
					<div class="integral"><text>{{integral}}</text>积分</div>
				</uni-col>
				<uni-col :span="14">
					<uni-section title="转发分享:" sub-title="+5积分(每日最多获得15积分)" titleColor="#FFF" subTitleColor="#FFF">
						<template v-slot:decoration>
							<view class="decoration"></view>
						</template>
					</uni-section>
					<uni-section title="发布主题:" sub-title="+5积分(每次发布均可获得2积分)" titleColor="#FFF" subTitleColor="#FFF">
						<template v-slot:decoration>
							<view class="decoration"></view>
						</template>
					</uni-section>
					<uni-section title="每日签到:" sub-title="+5积分(每日签到获得1积分)" titleColor="#FFF" subTitleColor="#FFF">
						<template v-slot:decoration>
							<view class="decoration"></view>
						</template>
					</uni-section>
				</uni-col>
			</uni-row>
			
		</div>
		
		<uni-section title="积分记录" type="line">
			<uni-list border-full>
				<uni-list-item v-for="item in infoData.list" :key="item.id" :title="item.des" :note="item.create_time" :rightText="item.score" />
			</uni-list>
		</uni-section>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form:{page:1},
				infoData:{list:[]},
				integral:0
			}
		},
		onShow() {
			this.onGetData()
			this.onGetIntegral()
		},
		methods: {
			onGetIntegral(){
				let _this = this
				this.$request('/api2/user_integral','POST',{}).then(res => {
					_this.integral = res.data
				}).catch(err => {
					console.log(err)
				})
			},
			onGetData(){
				let _this = this
				this.$request('/api2/user_integral_record','POST',this.form).then(res => {
					_this.infoData = res.data
				}).catch(err => {
					console.log(err)
				})
			},
		}
	}
</script>

<style>
.banner{
	background-image: url('https://xinzhu-1301398555.cos.ap-shanghai.myqcloud.com/wxapp/integral-bg.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 180px;
}
.integral{color: #FFF;padding-top: 90px;}
.integral text{font-size: 2.2rem;}
.decoration{ width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background-color: #ffbba0; }
</style>
